<template>
<div id="videoBox">
  <div class="select">
    <a-select style="width: 20%;float:left;" @change="handleChange" defaultValue="0">
    <a-select-option v-for="i in apiList" :key="i.value">{{i.name}}</a-select-option>
  </a-select>
    <a-input-search
      style="width: 80%;float:left;"
      placeholder="输入播放地址"
      @search="onSearch"
      enterButton
    />
  </div>
  <div class="video" :class="{'fullScreen': fullScreen}">
    <iframe id="playWindow" style="width:100%;background:#000000;height:420px;" allowFullScreen="ture" frameborder="0" border="0" marginwidth="0" marginheight="0" scrolling="no" :src="url"></iframe>
  </div>
  <!-- <a-icon type="arrows-alt" @click="fs" title="全屏" style="position: fixed; right: 60px; bottom: 30px; font-size: 30px; cursor: pointer;"/> -->
</div>
</template>
<script>
export default {
  name: 'videoParsing',
  data(){
    return {
      apiList: [
        {value: '0', label: 'http://api.bbbbbb.me/jx/?url=', name: '万能0'},
        {value: '1', label: 'http://api.wlzhan.com/sudu/?url=', name: '万能1'},
        {value: '2', label: 'http://api.47ks.com/webcloud/?v=', name: '万能2'},
        {value: '3', label: 'http://jiexi.071811.cc/jx2.php?url=', name: '万能3'},
        {value: '4', label: 'http://jqaaa.com/jq3/?url=', name: '万能4'},
        {value: '5', label: 'http://yun.baiyug.cn/vip/index.php?url=', name: '万能5'},
        {value: '6', label: 'http://api.xiaomil.com/a/index.php?url=', name: '腾讯1'},
        {value: '7', label: 'http://api.pucms.com/?url=', name: '爱奇艺1'},
        {value: '8', label: 'http://api.baiyug.cn/vip/index.php?url=', name: '爱奇艺2'},
        {value: '9', label: 'https://api.flvsp.com/?url=', name: '爱奇艺3'},
        {value: '10', label: 'http://api.xfsub.com/index.php?url=', name: '芒果1'},
        {value: '11', label: 'http://65yw.2m.vc/chaojikan.php?url=', name: '芒果2'},
        {value: '12', label: 'http://www.82190555.com/index/qqvod.php?url=', name: '优酷1'},
        {value: '13', label: 'http://vip.jlsprh.com/index.php?url=', name: '搜狐1'},
        {value: '14', label: 'http://2gty.com/apiurl/yun.php?url=', name: '乐视1'},
      ],
      url: '',
      actionApi: '',
      fullScreen: false
    }
  },
  methods: {
    onSearch(value) {
      if (!value || !this.actionApi) return
      // value = 'https://www.iqiyi.com/v_19rr2qh9mc.html'
      this.url = this.actionApi + value
      console.log(this.url);
      
    },
    handleChange(value) {
      this.actionApi = this.apiList[value].label
    },
    fs() {
      this.fullScreen = !this.fullScreen
    }
  },
  mounted() {
    this.actionApi = this.apiList[0].label
  }
}
</script>
<style scoped lang="less">
#videoBox {
  width: 100%;
  height: 100%;
  position: relative;
  .select {
    width: 100%;
    height: 40px;
  }
  .video {
    width: 100%;
    height: calc(100% - 40px);
    &.fullScreen{
      position: fixed;
      width: 100%;
      height: 100%;
      z-index: 99;
    }
  }
}
</style>
